/**
 * Created by pactera on 2018/6/14.
 */
/**
 * Created by pactera on 2018/6/6.
 */
var vm = new Vue({
    el:"#record",
    data:{
        accountColumn:[
            {type: 'selection', width: 60,align: 'center'},
            {title: '头像',  key: 'icon',
                columns: {'width':'50px' },
                render: function(h, params) {
                    return h('div', [
                        h('img', { attrs: { src: params.row.mediaDto.url },
                            style: {width: '70px',height: '70px',borderRadius:'100%' }
                        }),
                    ]);
                }
            },
            {title: '标题',key: 'title'},
            {title: '创建人',key: 'createAccount.account',align: 'center',
                render: function(h, params) {
                    return h('div', [
                        h('strong', params.row.createAccount.account)
                    ]);
                }},
            {title: '添加时间',key: 'createdDate'},
            {title: '修改人',key: 'updateAccount.account',align: 'center',
                render: function(h, params) {
                    return h('div', [
                        h('strong', params.row.updateAccount ? params.row.updateAccount.account:"")
                    ]);
                }},
            {title: '更新时间',key: 'updateDate'}
        ],
        records:[],
        formItem: {},
        showList: false,
        imgName: '',
        visible: false,
        imageUrl:'http://localhost:9098/media/default.jpg',
        pageSize: 2,
        totalElements:20,
        page:0,
        selectRows:[],
        roles:{},
        editors:null,
        editorConfig:{
            // 这里可以选择自己需要的工具按钮名称
            toolbars: [[  'fullscreen',  'undo', 'redo', '|',
                'bold', 'italic', 'underline', 'fontborder', 'strikethrough',
                'autotypeset', '|','forecolor', 'backcolor', 'insertorderedlist',
                'insertunorderedlist', 'selectall', 'cleardoc', '|',
                'customstyle', 'paragraph', 'fontfamily', 'fontsize', '|','indent', '|',
                'justifyleft', 'justifycenter', 'justifyright', 'justifyjustify', '|', 'touppercase', 'tolowercase', '|',
                'link', 'unlink',  '|','simpleupload', 'insertimage', 'template', 'background', '|',
                'horizontal', 'date', 'time', 'spechars', 'snapscreen', 'wordimage', '|',
                'inserttable', 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol', 'deletecol',
                'mergecells'     ]],
            // 默认的编辑区域高度和宽度
            initialFrameHeight:300,
            initialFrameWidth:650,
            //关闭elementPath
            elementPathEnabled:false
            // 更多其他参数，请参考ueditor.config.js中的配置项
        }
    },
    mounted:function () {
           $.get("/record?page=0&size="+this.pageSize, function(r){
               vm.records = r.data.content;
               vm.totalElements = r.data.totalElements;
           });
        this.editors = UE.getEditor('circle',this.editorConfig)
    },
    methods:{
        openModel: function () {
            this.showList = true;
        },
        saveRecord:function () {
            this.openModel();
            this.editors.setContent("");
        },
        updateRecord: function () {
            var rows = this.selectRows;
            if(rows && rows.length > 1){
                this.$Notice.warning({
                    title: '只能选择一条数据！'
                });
            }else if (rows && rows.length == 1){
                this.openModel();
                this.formItem = this.selectRows[0];
                this.imageUrl = this.formItem.mediaDto.url;
                this.editors.setContent(this.formItem.content);
            }else{
                this.$Notice.warning({
                    title: '请选择需要修改的数据！'
                });
            }
        },
        changePage:function (index) {
            this.page = index-1;
            this.getRecords();
        },
        onSelect: function (selection,row) {
            this.selectRows = selection;
        },
        onSelectCancel: function (selection,row) {
            this.selectRows = selection;
        },
        saveOrUpdate: function () {
            //富文本的值添加到formitem
            vm.formItem.content = UE.getEditor('circle').getContent();
            $.ajax({
                url: '/record/saveOrUpdate',
                type: 'post',
                data: JSON.stringify(vm.formItem),
                contentType: "application/json",
                success: function(result) {
                    if(result.code == 0){
                        vm.showList = false;
                        vm.getRecords();
                        this.formItem={};
                    }
                }
            });
        },
        getRecords: function () {
            this.reloadFormItem();
            $.get("/record?page="+this.page+"&size="+this.pageSize, function(r){
                vm.records = r.data.content;
                vm.totalElements = r.data.totalElements;
                vm.imageUrl = 'http://localhost:9098/media/default.jpg';
            });
        },
        deleteRoles: function () {
            $.ajax({
                url: '/record/delete',
                type: 'post',
                contentType: "application/json",
                data: JSON.stringify(vm.selectRows),
                success: function(result) {
                    if(result.code == 0){
                        vm.getRecords();
                        this.$Notice.warning({
                            title: '删除成功！'
                        });
                    }
                }
            });
        },
        handleSuccess:function (res, file) {
            this.imageUrl = res.data.url;
            this.formItem.icon = res.data.fullName;
        },
        handleMaxSize: function(file) {
            this.$Notice.warning({
                title: 'Exceeding file size limit',
                desc: 'File  ' + file.name + ' is too large, no more than 2M.'
            });
        },
        handleFormatError: function(file) {
            this.$Notice.warning({
                title: 'The file format is incorrect',
                desc: 'File format of ' + file.name + ' is incorrect, please select jpg or png.'
            });
        },
        reloadFormItem: function () {
            this.formItem = {};
        },
        back: function () {
            this.showList = false;
            this.reloadFormItem();
        }

    }
})